<template>
   <div>
       
        <el-card>
          <div slot="header" class="clearfix">
            <span style="line-height: 36px;">产品列表</span>
            <el-button type="primary" style="float:right" @click="add">
                新增
            </el-button>
        </div>
        <el-table v-if="tableData3.length>0" :data="tableData3" border style="width: 100%" >
            <el-table-column prop="PRODUCE_ID" label="ID" width="180">
            </el-table-column>
            <el-table-column prop="PRODUCE_WNAME" label="产品名称" width="180">
            </el-table-column>
            <el-table-column prop="PRODUCE_INAME" label="内部名称" width="200">
            </el-table-column>          
            
            <el-table-column label="操作" width="280">
                <template scope="scope">
                    <el-button type="text" size="media" @click="UserEditer(scope.row.PRODUCE_ID)">
                        <i class="el-icon-view"> 查看</i>
                    </el-button>
                     <el-button type="text" size="media" @click="BenifitShow(scope.row.PRODUCE_ID,scope.row.PRODUCE_WNAME)">
                        <i class="el-icon-view">查看利益表</i>
                    </el-button>
                </template>
            </el-table-column>
        </el-table>        
        <div class="block">
            <el-pagination @current-change="handleCurrentChange" :current-page="currentPage1" :page-size="10" layout="total, prev, pager, next" :total="pagecount">
            </el-pagination>
        </div>
         </el-card>
       <el-dialog title="产品信息" :visible.sync="ProduceInfo" v-if="ProduceInfo">
       <produce-show :type="type" :Id="Id" @close="close">
       </produce-show>
       </el-dialog>
       <el-dialog   title="利益表信息" :visible.sync="Benifit" v-if="Benifit" size="large">
         <benifit-show :type="BenifitType" :Id="Id" @close="close">
         </benifit-show>
       </el-dialog>
    </div>
</template>

<script>
import api from "@/js/api";
import ProduceShow from "@/components/System/Produce/Show";
import BenifitShow from "@/components/System/Produce/BenifitShow";
export default {
  data() {
    return {
      pagecount: 0,
      currentPage1: 1,
      tableData3: [],
      ProduceInfo: false,
      Benifit: false,
      BenifitType:'',
      searchDate: {
        name: ""
      },
      Id: "", //用户id
      type: ""
    };
  },
  components: {
    "produce-show": ProduceShow,
    "benifit-show": BenifitShow
  },
  methods: {
    UserEditer(Id) {
      this.ProduceInfo = true;
      this.Id = Id;
      this.type = "查看";
    },
    //利益表
    BenifitShow(Id,name) {
      this.Benifit = true;
      this.Id=Id;
      this.BenifitType=name.substr(2, 1)+name.substr(3, 1);
      // console.log(this.BenifitType);
    },
    add() {
      this.ProduceInfo = true;
      this.type = "新增";
    },

    handleCurrentChange(val) {
      this.currentPage1 = val;
      this.getDate();
    },
    close() {
      this.ProduceInfo = false;
      this.Benifit=false;
      this.getDate();
    },
    getDate() {
      let that = this;
      var data = {
        pageIndex: this.currentPage1,
        pageSize: 10
      };
      api.PRODUCEGetList(that, data, function(msg) {
        that.tableData3 = msg.Result;
        that.pagecount = msg.ListCount;
      });
    }
  },
  created() {
    this.getDate();
  }
};
</script>

<style>

</style>
